<?php get_header(); ?>

<script>
  $(document).ready(function(){
    var w_element = 860;
    var n = $('#news #smart-archives-block li').length;
    var now = 1;
    $('#news #smart-archives-block').css('width', (w_element*n)+'px');
    
    $('#news .date .next').click(function(){
      if(now < n){
        $('#news .date #smart-archives-block').animate({
          left: '-='+w_element
        });
        
        now++;
      }
    });
    
    $('#news .date .prev').click(function(){
      if(now > 1){
        $('#news .date #smart-archives-block').animate({
          left: '+='+w_element
        });
        
        now--;
      }
    });
  });
</script>

<script>
  $(function(){
    $('#pane1').jScrollPane();
    reinitialiseScrollPane = function(){
      $('#pane1').jScrollPane();
    }
  });

  function rebind(){
    $('.articles a').parent().eq(0).addClass('active');
    $('.pagination ul li:nth-child(1)').addClass('active');
  
    // onclick article title
    $('.articles a').bind('click', function(e){
      e.preventDefault();
      $('.articles a').parent().removeClass('active');
      $(this).parent().addClass('active');
      
      $('.news-content').css('opacity', 0);
      
      // remove the content
      $('.news-content').empty().jScrollPane({scrollbarWidth:20, scrollbarMargin:10});
      
      $('.news-content').load($(this).attr('href'), function(){
      
        var tmp = $('.news-content').imagesLoaded();
        tmp.always(function(){
          var arr = $('.news-content').html().split('<hr>');
          
          // change featured image
          if(arr[0].replace(/\s/g, "") == 'none'){
            $('#news .featured_image .pic_container').css('opacity', 0);
          }else{
            $('#news .featured_image .pic_container').css('opacity', 1);
            $('#news .featured_image .pic_container').html(arr[0]);
          }
          
          // change title
          $('#news p.title').html(arr[1]);
          
          // change content
          $('.news-content').html(arr[2]);
          
          $('.news-content').css('opacity', 1);
        }, function(){
          $('.news-content').jScrollPane();
        });
      });
    });
    
    //onclick pagination
    $('.pagination ul li').click(function(e){
      $('.pagination ul li').removeClass('active');
      $(this).addClass('active');
      
      var this_id = $(this).attr('alt');
      $('#'+this_id).find('a').trigger('click');
    });
  }

  $(document).ready(function(){
    $('.news-content').jScrollPane();
    
    // load latest articles
    // $('articles').load(
    $('.articles').jScrollPane();
    
    rebind();
    
    // onclick month
    $('.date strong a').click(function(e){ e.preventDefault(); });
    $('.date ul li > a').click(function(e){ 
      e.preventDefault(); 
      $('.articles').fadeOut('fast');
      
      $('.articles').load($(this).attr('href'), function(){
        var tmp = $('.articles').imagesLoaded();
        tmp.always(function(){
          $('.articles').jScrollPane();
          $('.articles').fadeIn('fast');
          rebind();
        });
      });
    });
  });
</script>

<div class="wrapper">
  <div id="news">
    <div class="header-content">
      <div class="slogan">
        <img src="<?php bloginfo('template_url'); ?>/images/logo.png" />
        <h3><?php bloginfo('name'); ?></h3>
        <p><?php bloginfo('description'); ?></p>
      </div>
      
      <div class="menu">
        <a href="<?php bloginfo('url'); ?>#home" class="fr">HOME</a>
        <ul>
          <li class="active"><a href="<?php bloginfo('url'); ?>/category/news">NEWS</a></li>
          <li><a href="<?php bloginfo('url'); ?>#about_us">ABOUT US</a></li>
          <li><a href="<?php bloginfo('url'); ?>#heavy_machine">HEAVY MACHINE</a></li>
          <li><a href="<?php bloginfo('url'); ?>#projects">PROJECTS</a></li>
          <li><a href="<?php bloginfo('url'); ?>/category/gallery">GALLERY</a></li>
          <li><a href="<?php bloginfo('url'); ?>#contact">CONTACT</a></li>
        </ul>
      </div>
    </div>
    
    <?php 
      $args = array(
        'numberposts'     => 1,
        'category'        => 1,
        'orderby'         => 'post_date',
        'order'           => 'DESC',
      ); 
      
      $posts = get_posts($args);
      $post = $posts[0];
      // print_r($posts[0]);
      // echo date('Y', strtotime($posts[0]->post_date));
      $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
    ?>
    
    <div class="content1">
      <h2>NEWS</h2>
      <p class="title"><?php echo $post->post_title; ?></p>
      
      <div class="news-content">
        <?php echo $post->post_content; ?>
      </div>
    </div>
    
    <div class="content2">
      <div class="featured_image">
        
        <div class="pic_container" style="<?php if($feat_image){ echo 'opacity: 1'; }else{ echo 'opacity: 0'; } ?>">
          <img src="<?php echo $feat_image; ?>" alt="<?php echo $post->post_content; ?>" />
        </div>

				<!--
        <div class="pagination">
          <ul>
            <?php
              $year = date('Y', strtotime($posts[0]->post_date));
              $month = date('n', strtotime($posts[0]->post_date));
              $datas = $wpdb->get_results("SELECT ID, post_name, post_title FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' AND MONTH(post_date)= '".$month."' AND YEAR(post_date) = '".$year."' ORDER BY post_date DESC");
              
              foreach($datas as $data){
              // $id = 
              $category = get_the_category($data->ID);
              if($category[0]->cat_ID == 1){
            ?>
            <li alt="<?php echo $data->post_name; ?>"></li>
            <?php }} ?>
          </ul>
        </div>
				-->
      </div>
      
      <div class="articles">
        <ul>
        <?php
          $year = date('Y', strtotime($posts[0]->post_date));
          $month = date('n', strtotime($posts[0]->post_date));
          $datas = $wpdb->get_results("SELECT ID, post_name, post_title FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' AND MONTH(post_date)= '".$month."' AND YEAR(post_date) = '".$year."' ORDER BY post_date DESC");
          
          foreach($datas as $data){
          // $id = 
          $category = get_the_category($data->ID);
          if($category[0]->cat_ID == 1){
        ?>
          <li id="<?php echo $data->post_name ?>"><a href="<?php echo bloginfo('url').'/news/'.$data->post_name ?>"><?php echo $data->post_title; ?></a></li>
        <?php }} ?>
        </ul>
      </div>
    </div>
    
    <div class="content3">
      <div class="date">
        <?php 
          $counter =0;
          
          foreach(get_the_category() as $category)
          { $thecat = $category->cat_ID; } 
        ?>
        <?php query_posts('cat=' . $thecat); ?>
      
        <div class="prev"></div>
        <div class="next"></div>
        
        <?php
          $sar_args = array(
            'format' => 'block',
          );

          $query_args = array(
            'post_type' => 'post'
          );

          smart_archives( $sar_args, $query_args );
        ?>
      </div>
    </div>
    
    <div id="footer">Copyright 2012  PT. Asia Putra Cemerlang.  design by visualcast designology</div>
  </div>
</div>

<?php get_footer(); ?>